<template>
  <div class="feedback-details">
    <div class="top-item"  v-if="!loading && currentJobStatus === 0">
      <div class="top-item-wrap">
        <div class="title">
          {{ jobInfo.jobName }}
          <span
            >{{
              jobInfo.lowestSalary + "-" + jobInfo.highestSalary
            }}元/天</span
          >
        </div>
        <div class="row">
          <span class="local-icon" />
          <span class="city">{{ jobInfo.city }}</span>
          <span class="small-text">{{ jobInfo.workPeriod }}</span
          ><span class="line" /><span class="small-text"
            >{{ jobInfo.practicePeriod }}个月</span
          >
        </div>
        <div class="row2">
          {{ jobInfo.companyName }} <span class="line"></span>
          {{ jobInfo.industry }}
        </div>
        <div class="date">
          <span class="last-operation">最近操作：{{ interInfo.inviteDate }}</span>
          <span class="open" @click="linkTo(jobInfo.id)">点击查看职位详情</span>
        </div>
        <div class="feedback-confirm-tips">
          <img src="../../assets/images/user/isFeedback.png" v-if="currentJobStatus > 0" alt="" />
          <img src="../../assets/images/user/isFeedback.png" v-else-if=" Number(interInfo.status) === 6 || Number(interInfo.status) === 8" alt="" />
        </div>
      </div>
      <div class="background-color-box"></div>
    </div>
    <div class="feedback-result-box">
      <div class="feedback-result">
        <p class="result-title">面试结果</p>
        <p class="result-text">
          <van-radio-group v-model="detailform.inviteResultType">
            <van-radio v-for="item in inviteResultType"
              :key="item.value" :name="item.value" :disabled="[6, 8].indexOf(Number(interInfo.status)) > -1 ||
                currentJobStatus > 0" shape="square">{{ item.label }}</van-radio>
          </van-radio-group>
        </p>
      </div>
      <div class="feedback-result reject-reason">
        <p class="result-title">评价/原因</p>
        <p class="result-text">
          <van-field v-model="feedback"
            :disabled="interInfo.status == '6' || currentJobStatus > 0"
            size="20"
            :autosize="{minHeight: '100', maxHeight: '210'}"
            type="textarea"
            maxlength="250"
            placeholder="请输入内容"
            show-word-limit
          />
        </p>
      </div>
      <div class="btn-box">
        <!-- 简历状态（新），resumeStatus（投递过程的工单状态）
        *  0 投递成功，企业未查看简历、
        *  1 企业已查看投递记录、
        *  2 已发送面试邀约、
        *  3 学生已查看 、
        *  4 已拒绝面试邀约、
        *  5 已确认面试邀约、
        *  6 学生已反馈，企业未反馈、
        *  7 企业已反馈，学生未反馈、
        *  8 都反馈，结束
        -->
        <div
          class="btn confirm"
          @click="submit"
          v-if="
            [5, 7].indexOf(Number(interInfo.status)) > -1 &&
            currentJobStatus === 0
          "
        >
          提交
        </div>
      </div>
    </div>
  </div>
</template>

<script>
import Vue from 'vue';
import { inviteResultType, getWorkPeriodName } from "@/utils/frontDataDict.js";
import { formatTime } from "../../utils/utils";
import {
  getInviteInfo,
  getJobInfo,
  updateInvite,
  isJob,
} from "../../request/api";
import { Toast } from 'vant';
Vue.use(Toast);
export default {
  data() {
    return {
      detailform: {
        inviteWay: ["0"],
        noticeItem: [],
        inviteResultType: [],
        reasonText: "",
      },
      inviteResultType: inviteResultType,
      jobInfo: {},
      interInfo: {},
      feedback: "",
      loading: false,
      currentJobStatus: 0 // 0 发布 1 暂停发布 2 删除
    }
  },
  created() {
    this.getFeedBackDetails();
  },
  methods: {
    linkTo(id) {
      localStorage.setItem("currentJobId", id);
      this.$router.push({
        path: `/jobDetail/${id}`,
      });
    },
    getFeedBackDetails() {
      let { id, jobId } = this.$route.query;
      console.log('id: ', id, jobId);
      isJob({ id: jobId }).then((res) => {
        if (res.code === 0 && res.data) {
          /**
           * 职位状态 0 发布 1 暂停发布 2 删除
           */
          this.currentJobStatus = Number(res.data);
          getInviteInfo({ id }).then((InviteRes) => {
            if (InviteRes.data) {
              if (InviteRes.data.inviteDate) InviteRes.data.inviteDate = formatTime(new Date(InviteRes.data.inviteDate));
              try {
                if (InviteRes.data.inviteResultType) this.detailform.inviteResultType = JSON.parse(InviteRes.data.inviteResultType) || [];
              } catch {
                () => {};
              }
              this.interInfo = InviteRes.data;
              this.feedback = InviteRes.data.feedback;
              getJobInfo({ id: InviteRes.data.jobId }).then((vv) => {
                this.loading = false;
                if (vv.data) {
                  try {
                    if (Array.isArray(JSON.parse(vv.data.industry))) {
                      vv.data.industry = JSON.parse(vv.data.industry)[1];
                    }
                    if (Array.isArray(JSON.parse(vv.data.city))) {
                      vv.data.city = JSON.parse(vv.data.city)[1];
                    }
                  } catch {
                    () => {};
                  }
                  if (vv.data.workPeriod) vv.data.workPeriod = getWorkPeriodName(vv.data.workPeriod);
                  this.jobInfo = vv.data;
                  console.log('this.jobInfo: ', this.jobInfo);
                }
              }).catch((err) => {
                this.loading = false;
              });
            } else {
              this.loading = false;
            }
          }).catch((err) => {
            this.loading = false;
          });
        }
      });
    },
    submit() {
      if (this.detailform.inviteResultType.length === 0) {
        Toast("请选择面试结果");
        return;
      }
      if (!this.feedback) {
        Toast("请输入评价/原因");
        return;
      }
      let { evaluation, status } = this.interInfo;
      if (evaluation === "" || evaluation === null) {
        status = 6;
      } else {
        status = 8;
      }
      let inviteResultType = JSON.stringify(this.detailform.inviteResultType);
      let parmas = {
        feedback: this.feedback,
        status: "" + status,
        sendRecordId: this.interInfo.sendRecordId,
        id: this.interInfo.id,
        companyId: this.jobInfo.companyId,
        jobId: this.jobInfo.id,
        studentId: this.interInfo.studentId,
        userId: this.interInfo.studentId,
        inviteResultType,
      };
      console.log("parmas>>>", parmas);
      updateInvite(parmas).then((res) => {
        if (res.data) {
          Toast("操作成功");
          // 跳转feedback列表页
          this.$router.push({
            path: `/feedback`,
          });
        } else {
          Toast(res.msg);
        }
      });
    }
  }
}
</script>

<style lang="less" scoped>
@media (max-width: 768px) {
  .top-item-wrap {
    padding: 0.2rem 0.1rem 0.15rem;
    font-size: 0.13rem;
    color: #9597a0;
    position: relative;
    background-color: #ffffff;
    .title {
      display: flex;
      height: 0.28rem;
      align-items: center;
      font-size: 0.2rem;
      font-weight: 500;
      color: #37383d;
      .title-name {
        flex: 1;
      }
      .salary {
        font-size: 0.13rem;
        color: #9597a0;
      }
    }
    .row {
      display: flex;
      height: 0.18rem;
      align-items: center;
      margin: 0.1rem 0;
      .local-icon {
        width: 0.13rem;
        height: 0.16rem;
        background: url("../../assets/images/position.png") no-repeat center
          center / cover;
      }
      .city {
        font-size: 0.13rem;
        color: #37383d;
        margin: 0 0.16rem 0 0.07rem;
      }
    }
    .row2 {
      height: 0.18rem;
      line-height: 0.18rem;
      margin-bottom: 0.12rem;
    }
    .date {
      display: flex;
      height: 0.18rem;
      line-height: 0.18rem;
      .last-operation {
        flex: 1;
        font-size: 0.12rem;
        color: #c4c4c4;
      }
      .open {
        color: #2f8efe;
      }
      
    }
    .feedback-confirm-tips {
      width: 1.06rem;
      height: 0.68rem;
      position: absolute;
      right: 0.21rem;
      bottom: 0.23rem;
      img {
        width: 100%;
        height: 100%;
      }
    }
  }
  .background-color-box {
    width: 100%;
    height: 0.1rem;
    background-color: #fafafa;
  }
  .line {
    display: inline-block;
    width: 1px;
    height: 14px;
    background: #9597a0;
    margin: 0 10px;
  }
  .feedback-result {
    padding: 0 0.1rem;
    .result-title {
      padding: 0.15rem 0 0.12rem;
      font-size: 0.15rem;
      font-weight: 500;
      color: #37383D;
      line-height: 0.21rem;
    }
  }
  .btn-box {
    margin: 0.8rem 0.16rem 0.4rem;
    .btn {
      font-size: 0.15rem;
      color: #ffffff;
      height: 0.55rem;
      font-weight: 500;
      background: #3D6CB0;
      border-radius: 0.05rem;
      line-height: 0.55rem;
      text-align: center;
    }
  }
  /deep/ .van-radio-group {
    display: flex;
    flex-wrap: wrap;
    .van-radio {
      margin-right: 0.16rem;
      margin-bottom: 0.12rem;
      font-size: 0.15rem;
      line-height: 0.21rem;
      .van-radio__label {
        color: #B1B1B1;
      }
    }
  }
  /deep/ .van-field {
    border-radius: 0.02rem;
    border: 1px solid #F0F0F0;
    font-size: 0.14rem;
    color: #37383D;
    line-height: 0.2rem;
  }
}
</style>